<template>
  <div class="flex flex-col">
    <!-- <div class="leading-none mb-2">{{ groupNames[0] }}</div>
    <div class="leading-none mb-2">{{ groupNames[1] }}</div>
    <div class="leading-none">{{ groupNames[2] }}</div> -->
    <template v-if="params.value">
      <div class="leading-none mb-2">{{params.value.groupName}}</div>
      <div class="leading-none mb-2">{{params.value.sub_array.join(', ')}}</div>
      <div class="leading-none">{{params.value.lucky_array.map(Number).join(', ')}}</div>
    </template>
    <span v-else>-</span>
  </div>
</template>

<script>
export default {
  props: {
    params: {
      type: Object,
      required: true
    }
  },
  computed: {
    groupNames() {
      return (this.params.value || []).map(item => item.groupName)
    }
  },
  mounted() {
    // console.log('CustomCellRenderer params:', this.params)
  }
}
</script>
